<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
       img{
            position: absolute;
            
       }
       h1{
           position: relative;
           top: 36px;
           left: 30px;
           color: white;
       }
       p{
           position: relative;
           top: 90px;
           left: 30px;
           color: white;
       }
       .shijian{
           font-size: 18px;
           font-weight: 700;
       }
       div{
           position: relative;
           float: left;
           top: 90px;
           left: -5px;
           margin-left: 18px;
           width: 40px;
           height: 40px;
           background-color: black;
           color: white;
           text-align: center;
           line-height: 40px;
           font-size: 30px;
       }
       h4{
           position: relative;
           float: left;
           color: white;
           top: 76px;
           left: 4px;
       }
    </style>
</head>
<body>
    <img src="/images/bg.png" alt="">
    <h1>京东秒杀</h1>
    <p><span class="shijian">10:00</span>点场 距结束</p>
    <div class="shi"></div><h4>:</h4><div class="fen"></div><h4>:</h4><div class="miao"></div>
    <script>
        var shi = document.querySelector('.shi');
        var fen = document.querySelector('.fen');
        var miao = document.querySelector('.miao');
        var intime = +new Date('2021-6-30 10:00:00');
        countDown()
        setInterval(countDown,1000)
        function countDown() {
            var nowTime = +new Date()
            var times = (intime-nowTime)/1000
            var h = parseInt(times/60/60%24)
            h=h<10?'0'+h:h
            shi.innerHTML = h
            var m = parseInt(times/60%60)
            m=m<10?'0'+m:m
            fen.innerHTML = m
            var s = parseInt(times%60)
            s=s<10?'0'+s:s
            miao.innerHTML = s
            
        }



    </script>

</body>
</html>